<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			let colors=[]
				function init(){
					let xhr=new XMLHttpRequest()
					xhr.open("GET","colors.xml",true)
					xhr.send();
					xhr.onreadystatechange=function(){
						if(xhr.readyState==4&&xhr.status==200){
							let data=xhr.responseXML
							colors = data.querySelectorAll("color")
							let select=document.querySelector("select")
							for (var i = 0; i < colors.length; i++) {
								select.options[i]=new Option(colors[i].querySelector("name").innerHTML)
							}
							let c=colors[0].querySelector("value").innerHTML
							document.body.setAttribute("style","background-color:"+c+";")
						}
					}
					
					
				}
		</script>
	</head>
	<body onload="init()">
		请选择背景颜色<select></select>
		<script type="text/javascript">
			let select=document.querySelector("select")
			select.addEventListener("change",function(){
				let index=select.selectedIndex
				let c=colors[index].querySelector("value").innerHTML
				document.body.setAttribute("style","background-color:"+c+";")
			})
		</script>
	</body>
</html>
